Quick start

The documentation describes the algorithm for connecting the DxCharts library for the Android OS with basic functionality.

The documentation is divided into two parts:

Dependency setup and Gradle configuration;
Connecting the library to the App, configuring the Activity.

Dependencies and Gradle configuration

WebView support

Our framework use WebView to show chart. Minimal supported version of WebView is 83.0.4103.106.

Jetpack Compose setup

To work with the library, it is necessary to import dependencies and configure Jetpack Compose. You can refer to the official manual for configuring Compose at https://developer.android.com/jetpack/compose/setup.

Library support all versions of kotlinCompilerExtensionVersion from 1.5.0 and higher and Compose BOM versions from 2023.08.00

According to requirement of kotlinCompilerExtensionVersion you also need kotlin version 1.9.0 and higher. The Android Gradle Plugin version must be 8.1.0 or higher.

plugins {
    //...
    id 'com.android.library' version '8.1.0' apply false
    id 'org.jetbrains.kotlin.android' version '1.9.0' apply false
}

dependencies {
    //...
    def composeBom = platform('androidx.compose:compose-bom:$COMPOSE_BOM_VERSION')
    implementation composeBom
    androidTestImplementation composeBom

    implementation 'androidx.compose.foundation:foundation'
    implementation 'androidx.compose.ui:ui'
    implementation 'androidx.activity:activity-compose:$ACTIVITY_COMPOSE_VERSION'
    //...
}

android {
    //...
    buildFeatures {
        compose true
    }

    composeOptions {
        kotlinCompilerExtensionVersion = "1.5.2"
    }
    //...
}

Also in the library we use viewModels, constraintLayout, material3. So you need to add dependencies for them:

dependencies {
    //...
    implementation 'androidx.lifecycle:lifecycle-viewmodel-compose:2.8.0'
    implementation 'androidx.constraintlayout:constraintlayout-compose:1.1.0'
    implementation 'androidx.compose.material3:material3'
    //...
}

Library's repository and Nexus authorization

All artifacts of the DxCharts library for Android are located in the Maven repository https://nexus.in.devexperts.com/. To access it, you need to add the following repository to your project:

https://nexus.in.devexperts.com/repository/dx/.

Also, to access the artifacts, authorization in the Maven repository is required. For more details, you can refer to the following links: Maven authentication for Gradle, CI / CD best practices in Devexperts.

buildscript {
        repositories {
            maven { url 'https://nexus.in.devexperts.com/repository/dx/' }
            mavenCentral()
        }
        dependencies {
            classpath 'com.devexperts.gradle.auth:maven-auth:1.0'
        }
    }
    apply plugin: 'maven-auth'
}

Other dependencies requirements

The library uses the Gson library for parsing JSON data and ThreeTenABP for working with dates and times. You need to add these dependencies to your project:

dependencies {
    //...
    implementation 'com.google.code.gson:gson:2.10.1'
    implementation 'com.jakewharton.threetenabp:threetenabp:1.4.7'
    //...
}

Library's modules

The library functionality requires the connection of the core module and data providers.

You can use the standard demo implementation of data providers or implement your own using the provided interfaces.

For implementing custom data providers, no additional dependencies are required. More details can be found in the guide Configuration.

Core DxCharts Android Library module

The core package of the library includes fundamental logic and UI components.

Version (upd. 02 Apr 2025) - 1.4.1

Nexus URL - https://nexus.in.devexperts.com/#browse/search=keyword%3Dcom.devexperts.dxcharts.lib%3Adxcharts_lib

Minimum Android API version - 23

Dependency connection in build.gradle:

dependencies {
    implementation 'com.devexperts.dxcharts.lib:dxcharts_lib:$MAIN_LIB_VERSION'
    implementation 'com.devexperts.dxcharts.provider:dxcharts_data_providers:$'DATA_PROVIDER_VERSION'
    // User's dependencies
 }

DxFeed Data providers for DxCharts Android Library

A set of standard Demo-implementations for data providers (with a 15-minute delay), operating through the DxFeed API.

Module name	Description	Version(upd. 02 Apr 2025)	Nexus Link	Package name in build.gradle	Min. API Version
dxcharts_dxfeed_candles_provider	Provides data with selected trading instrument's candles that needs to be displayed on the chart.	1.4.1	Link	`com.devexperts.dxcharts.provider.candles:dxcharts_dxfeed_candles_provider`	24
dxcharts_dxfeed_events_provider	Provides data with events related to the selected trading instrument, including corporate events, dividends information, and splits.	1.4.1	Link	`com.devexperts.dxcharts.provider.events:dxcharts_dxfeed_events_provider`	23
dxcharts_dxfeed_ipf_provider	Provides data with available trading instruments and trading hours.	1.4.1	Link	`com.devexperts.dxcharts.provider.ipf:dxcharts_dxfeed_ipf_provider`	23
dxcharts_dxfeed_news_provider	Provides news about the selected instrument, which will be displayed on the chart.	1.4.1	Link	`com.devexperts.dxcharts.provider.news:dxcharts_dxfeed_news_provider`	23
dxcharts_studies_provider	Calculates and provides indicators data on the chart based on the provided input data.	1.4.1	Link	`com.devexperts.dxcharts.provider.studies:dxcharts_dxfeed_studies_provider`	24

All of this providers are not necessary. It is possible to not connect one or several data providers to the core module of the library. In this case, the library will still function, but the data provided by these provider(s) will not be shown.

To enable all functionality, all default data providers will be used in this guide.

Dependencies in build.gradle:

dependencies {
    implementation 'com.devexperts.dxcharts.provider.candles:dxcharts_dxfeed_candles_provider:$CANDLES_PROVIDER_VERSION'
    implementation 'com.devexperts.dxcharts.provider.events:dxcharts_dxfeed_events_provider:$EVENTS_PROVIDER_VERSION'
    implementation 'com.devexperts.dxcharts.provider.ipf:dxcharts_dxfeed_ipf_provider:$IPF_PROVIDER_VERSION'
    implementation 'com.devexperts.dxcharts.provider.news:dxcharts_dxfeed_news_provider:$NEWS_PROVIDER_VERSION'
    implementation 'com.devexperts.dxcharts.provider.studies:dxcharts_studies_provider:$STUDIES_PROVIDER_VERSION'
    // User's dependencies
}

Connecting library to the App

In this section, the algorithm for connecting the DxCharts library directly to the Android application is described.

The data obtained by the library consists of demo data from the DxFeed API.

All modules from section 1 should be connected to the project.

Upon application restart, the library parameters are reset to default. You can manually implement data repositories to store data in the persistent storage (see Configuration article 4).

Algorithm for Connecting the Library

Data provider initialization

The first step is to initialize objects for all data providers connected to the library. Data providers should be initialized once during the program's execution. You can do this anywhere in your project. In our example, this occurs inside the base Activity class.


class DXChartsActivity : AppCompatActivity() {
  //...
  private val quotesProvider: DxFeedQuotesProvider = DxFeedQuotesProvider()
  private val candlesProvider = DxFeedCandlesProvider()
  private val newsProvider = DxFeedNewsProvider()
  private val dxFeedIpfProvider = DxFeedHttpIpfProvider()
  private val scheduleProvider = DxFeedHttpScheduleProvider()
  private val eventsProvider = DxFeedEventsProvider()
  private val studiesProvider = DxStudiesDataProviderImplementation()
  private val studiesPreviewProvider = DxStudiesPreviewDataProviderImplementation()
  //...
}

Default implementations of candles and quotes providers requires endpoint address for dxfeed library as a parameter.

Default implementations of news, instruments and events providers requires url and token for authorization on dxfeed sources.

If you don't pass any parameter it will be empty and corresponding provider won't work


  private val quotesProvider = DxFeedQuotesProvider(
      endpointAddress = "endpoint"
  )
  private val candlesProvider = DxFeedCandlesProvider(
      endpointAddress = "endpoint"
  )
  private val newsProvider = DxFeedNewsProvider(
      url = "https://url",
      token = "Basic " + String(Base64.encode("token".encodeToByteArray(), Base64.NO_WRAP))
  )
  private val dxFeedIpfProvider = DxFeedHttpIpfProvider(
      url = "https://url",
      token = "Basic " + String(Base64.encode("token".encodeToByteArray(), Base64.NO_WRAP))
  )
  private val scheduleProvider = DxFeedHttpScheduleProvider(
      token = "Basic " + String(Base64.encode("token".encodeToByteArray(), Base64.NO_WRAP))
  )
  private val eventsProvider = DxFeedEventsProvider(
      url = "https://url",
      token = "Basic " + String(Base64.encode("token".encodeToByteArray(), Base64.NO_WRAP))
  )

Start of Data providers work, connecting to the Dxfeed API

The next step is to invoke methods of the created objects to establish a connection to the DxFeed API and start fetching data. In our example, this takes place in the onCreate method of the base Activity to create a new connection when the Activity is recreated and to close it in the onDestroy method.


//...
override fun onCreate(savedInstanceState: Bundle?) {
  //...
  quotesProvider.connect()
  candlesProvider.connect()
  dxFeedIpfProvider.requestData()
  studiesProvider.start()
  studiesPreviewProvider.start()
  //...
}
//...

Loading the list of indicators

The list of indicators is loaded into the library manually. To load the list of default indicators from XML files stored in the library, you need to override the default repository for them as follows:


//...
val studiesRepo = LocalStorageDefaultStudiesRepository(
  StudiesLoader().load(assets).toMutableList()
)
studiesRepo.initialiseDefaultStudies()
//...

Creating the library configuration object

The next step is creating an object of the com.devexperts.dxcharts.lib.domain.DxChartsConfig class, which holds the initial configuration of the DxCharts library. It includes data providers, repositories for data storage, and the default instrument name to be loaded onto the chart.

All repositories for data storage are necessary for the library to function. By default, they do not persist data in the device's memory and are cleared upon application restart.

All default data providers are initially set to null. When creating the configuration, we override them with the demo data providers that we connected earlier.


//...
override fun onCreate(savedInstanceState: Bundle?) {
  //...
  val config = DxChartsConfig(
      repositories = DxChartsConfig.Repositories(
          studiesRepository = studiesRepo,
      ),
      providers = DxChartsDataProviders(
          candlesProvider = candlesProvider,
          ipfProvider = dxFeedIpfProvider,
          scheduleProvider = scheduleProvider,
          quotesProvider = quotesProvider,
          eventsProvider = eventsProvider,
          newsProvider = newsProvider,
          studiesDataProvider = studiesProvider,
          studiesDataPreviewProvider = studiesPreviewProvider
      ),
      initialInstrumentName = InstrumentData.NONE,
  )
  //...
}
//...

Show DxCharts Android Library content

To connect DxCharts library to the application and display its UI, you need to call the method androidx.activity.compose.setContent. Inside this method, pass the theme used by the library (**com.devexperts.dxcharts.lib.ui.theme.DxChartsTheme**) in which the entry point into the DxCharts library is called. All parameters of the DxChartsTheme theme can be modified by a developer, for more details - Configuration article 2.

In addition to passing the configuration (dxChartsConfig) when calling the com.devexperts.dxcharts.lib.ui.DxChartsScreen method, you can also provide callbacks for:

Pressing the "back" button on the chart screen - backHandler
Pressing the "buy" button on the trading widget - buyClicked
Pressing the "sell" button on the trading widget - sellClicked

By default, they are set to null, meaning that nothing will happen when the buttons are pressed, and the application cannot be closed by pressing the "back" button.


//...
override fun onCreate(savedInstanceState: Bundle?) {
  //...
  setContent {
      DxChartsTheme {
          DxChartsScreen(
              dxChartsConfig = config,
              backHandler = { finish() }
          )
      }
  }
  //...
}
//...

Customizing size of the chart

Chart can be placed on only part of the screen, so that the rest is occupied by your UI.

To do that you can wrap it in container and set size or position for it.


      setContent {
          DxChartsTheme {
              Surface(
                  modifier = Modifier
                      .size(
                          height = 600.dp,
                          width = 300.dp
                      ),
              ) {
                  DxChartsScreen(
                      //...
                  )
              }
          }
      }

We do not recommend setting the height less than 600dp and the width less than 300dp, if you want to use full UI of our framework (toolbar, trade buttons, etc.). Otherwise, UI artifacts may occur.

Providing your logo

With calling com.devexperts.dxcharts.lib.ui.DxChartsScreen method, you also can provide your logo to chart. By default, there are no any logo.

All you need is to pass com.devexperts.dxcharts.lib.domain.Logo object. As image you provide you logo from resources.


setContent {
      DxChartsTheme {
          DxChartsScreen(
              logo = Logo(
                  image = R.drawable.devexperts_logo,
                  position = Logo.LogoPosition.BOTTOM_LEFT,
              ),
          )
      }
  }

As position you just need to define corner of the chart, where logo should be shown.


enum class LogoPosition {
      /**
       * Logo positioned at the top right corner of the screen.
       */
      TOP_RIGHT,
      /**
       * Logo positioned at the top left corner of the screen.
       */
      TOP_LEFT,
      /**
       * Logo positioned at the bottom right corner of the screen.
       */
      BOTTOM_RIGHT,
      /**
       * Logo positioned at the bottom left corner of the screen (default position).
       */
      BOTTOM_LEFT
  }

Also you can define whether you want to use toolbar or not, by passing boolean to showToolbar parameter.

By default it is set to true


setContent {
      DxChartsTheme {
          DxChartsScreen(
              showToolbar = true,
          )
      }
  }

Configuring onDestroy method

To ensure that providers disconnect from the DxFeed API when the Activity is destroyed, preventing memory leaks, you need to manually invoke the corresponding methods for all providers in the onDestroy method:


//...
override fun onDestroy() {
  //...
  newsProvider.disconnect()
  dxFeedIpfProvider.disconnect()
  quotesProvider.disconnect()
  candlesProvider.disconnect()
  eventsProvider.disconnect()
  studiesProvider.disconnect()
  studiesPreviewProvider.disconnect()
  //...
}
//...

Dependencies and Gradle configuration​

WebView support​

Jetpack Compose setup​

Library's repository and Nexus authorization​

Other dependencies requirements​

Library's modules​

Core DxCharts Android Library module​

DxFeed Data providers for DxCharts Android Library​

Connecting library to the App​

Algorithm for Connecting the Library​

Data provider initialization​

Start of Data providers work, connecting to the Dxfeed API​

Loading the list of indicators​

Creating the library configuration object​

Show DxCharts Android Library content​

Customizing size of the chart​

Providing your logo​

Configuring toolbar​

Configuring onDestroy method​